<!--
 * @Author: 可以清心
 * @Description: 
 * @Date: 2023-01-14 13:50:15
 * @LastEditTime: 2023-01-14 19:08:12
-->
<template>
  <div id="app">
    <div class="login" v-if="!loading">
      <div class="top">
        <div class="img">
          <img src="@/assets/logo.png" alt="">
        </div>
        <div class="title">
          欢迎您登录低代码系统
        </div>
      </div>
      <div class="bottom">
        <apaas-form></apaas-form>
      </div>
    </div>
    <div class="loading-wrap" v-else>
      <div class='app-loading' style="color: #005EBA;">
        <div class="loading">
          <div></div>
          <div></div>
          <div></div>
          <div></div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import ApaasForm from './components/Form.vue'
export default {
  name: 'App',
  components: {
    ApaasForm
  },
  data() {
    return {
      loading: true
    }
  },
  created(){
    this.jumpApp();
  },
  methods: {
    /**
       * @description: 获取应用信息
       * @return {any}
       */
    getApplicationInfo() {
      let GLOBAL_ENV = window.GLOBAL_ENV;

      if (GLOBAL_ENV) {
        return {
          tenantId: GLOBAL_ENV['VUE_APP_TENANT_ID'],
          appId: GLOBAL_ENV['VUE_APP_APP_ID'],
          domain: GLOBAL_ENV['VUE_APP_BASE_DOMAIN'],
          path: GLOBAL_ENV['VUE_APP_PUBLIC_PATH']
        }
      }

      return {}
    },
    /**
       * @description: 有token跳转应用
       * @return {void}
       */
    jumpApp() {
      const { getApplicationInfo } = this;

      let applicationInfo = getApplicationInfo();

      const { appId, domain } = applicationInfo;

      let storageInfo = localStorage.getItem(`__vuex__${appId}__local`);

      let result = null;

      try {
        result = JSON.parse(storageInfo);
      } catch (error) {
        console.error('解析json失败');
      }

      if (result && result.authModule && result.authModule.token) {
        window.open(domain + '/m/', '_self')
      } else {
        this.loading = false;
      }
    },
  }
}
</script>

<style>
html {
  font-size: 10px;
}

body {
  margin: 0;
  padding: 0;
  border: 0;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  width: 100%;
}

.loading-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#app .top {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#app .top .img {
  width: 15.2rem;
  height: 15.2rem;
}

#app .top .img img {
  width: 15.2rem;
  height: 15.2rem;
}

#app .top .title {
  margin-top: 4rem;
  opacity: 0.8;
  font-family: PingFangSC-Regular;
  font-size: 3.2rem;
  color: #4D4D4F;
  line-height: 3.2rem;
  font-weight: 400;
}


#app .bottom {
  margin-top: 9.8rem;
}

input:-internal-autofill-selected {
  /* -webkit-text-fill-color: #FFFFFF !important; */
  transition: background-color 5000s ease-in-out 0s !important;
  line-height: 3rem;
}

.van-field__body {
  height: 100%;
}

.van-field__left-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>
